<template>
  <div class="outer">
    <h1>App</h1>
    {{list}}
    <List ref="listComp"/>
  </div>
</template>

<script>
import _ from "lodash"
import List from "./List"
export default {
    name:"App",
    components:{
        List
    },
    data(){
        return {
            list:[]
        }
    },
    methods:{
        getListData(list){
            //使用lodash上的方法深拷贝
            this.list=_.cloneDeep(list)
            console.log(this.list[0] === list[0]);

        }
    },
    mounted(){
        this.$refs.listComp.$on("getListData",this.getListData)
    }

}
</script>

<style>
.outer {
  height: 400px;
  background: #3cf;
}
</style>